<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('信息安全管理详情')" />
</head>
<body class="gray-bg">
     <div class="container-div">
         <div class="row" style="height: 20%">
             <div class="col-sm-12 search-collapse">
                 <form id="formId">
                     <div class="select-list">
                         <ul>
                             <li>
                                 <label>企业名称：</label>
                                 <div th:text="${infoManagement.enterpriseName}" style="width: 200px"></div>
<!--                                 <input type="text" name="enterpriseName"/>-->
                             </li>
                             <li>
                                 <label>系统名称：</label>
                                 <div th:text="${infoManagement.systemName}" style="width: 200px"></div>
                             </li>
                             <li>
                                 <label>安全等级：</label>
                                 <div th:text="${infoManagement.systemType}+1" style="width: 150px"></div>
                             </li>
                             <li>
                                 <label>保障制度：</label>
                                 <div th:text="${infoManagement.securityStep}" style="width: 200px"></div>
                             </li>
                         </ul>
                     </div>
                 </form>
             </div>
         </div>
        <div class="row">

            <div class="col-sm-6">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>柱状图</h5>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                <i class="fa fa-wrench"></i>
                            </a>
                            <ul class="dropdown-menu dropdown-user">
                                <li><a href="#">选项1</a>
                                </li>
                                <li><a href="#">选项2</a>
                                </li>
                            </ul>
                            <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>
                    <div class="ibox-content">

                        <div class="echarts" id="echarts-bar-chart"></div>
                    </div>
                </div>
            </div>


<!--            <div class="col-sm-12 select-table table-striped">-->
<!--                <table id="bootstrap-table"></table>-->
<!--            </div>-->
        </div>
    </div>
    <th:block th:include="include :: footer" />
     <th:block th:include="include :: echarts-js" />
    <script th:inline="javascript">
        var editFlag = [[${@permission.hasPermi('system:management:edit')}]];
        var removeFlag = [[${@permission.hasPermi('system:management:remove')}]];
        var systemTypeDatas = [[${@dict.getType('info_system_type')}]];
        var securityLevelDatas = [[${@dict.getType('info_security_level')}]];
        var prefix = ctx + "system/management";

        $(function() {
            // var options = {
            //     url: prefix + "/list",
            //     createUrl: prefix + "/add",
            //     updateUrl: prefix + "/edit/{id}",
            //     removeUrl: prefix + "/remove",
            //     exportUrl: prefix + "/export",
            //     modalName: "信息系统管理",
            //     columns: [{
            //         checkbox: true
            //     },
            //     {
            //         field: 'infoId',
            //         title: '序号',
            //         visible: false
            //     },
            //     {
            //         field: 'enterpriseName',
            //         title: '企业名称'
            //     },
            //     {
            //         field: 'systemName',
            //         title: '系统名称'
            //     },
            //
            //     {
            //         title: '操作',
            //         align: 'center',
            //         formatter: function(value, row, index) {
            //             var actions = [];
            //             let infoId = row.infoId;
            //
            //             actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="/system/evaluate/evaluate"  ><i class="fa fa-edit"></i>评价建议</a> ');
            //
            //             return actions.join('');
            //         }
            //     }]
            // };
            // $.table.init(options);



            var barChart = echarts.init(document.getElementById("echarts-bar-chart"));
            var baroption = {};
            barChart.setOption(baroption);

            baroption = {
                title : {
                    text: '信息系统数量统计'
                },
                legend: {
                    data:['2021','2022']
                },
                xAxis :
                    {
                        data : ['云安全','身份安全','数据安全','移动安全']
                    }
                ,
                yAxis : {},
                series : [
                    {
                        name:"2021",
                        type:'bar',
                        data:[2.0, 4.9, 7.0, 23.2],
                    },
                    {
                        name:"2022",
                        type:"bar",
                        data:[30,30,22,19]
                    }
                ]
            };
            barChart.setOption(baroption);

            window.onresize = barChart.resize;
        });
    </script>
</body>
</html>